<!--Tree View-->
<div class='col-md-3'>
<!-- Enter id tree2 -->
	<div id="tree2" class="tree unselectable">		
	</div>
	
</div>
<!--List product  View-->
<div class='col-md-9 list-product-field'>
<!--    Add button-->
    <div class='row add-button-row' >
        <button class="btn btn-primary" type="button">
            <span class="glyphicon glyphicon-plus"></span>
            <?php echo $this->lang->line('add');?>
         </button>
    </div>
 <!--product table-->
    <div class="row list-products-row "> 
        <table class="table table-condensed table-bordered table-hover" style="text-align: center">
    <!--Header-->
            <thead >
                <tr>
                    <th>#</th>
                     <th width="18%"><?php echo $this->lang->line('image'); ?></th>
                    <th>
                          <div class="row">
                            <div class="col-md-8"><?php echo $this->lang->line('product_id'); ?></div>
                            <div class="col-md-4"><span class="glyphicon glyphicon-chevron-down sortbyid"></span></div>
                        </div>
                    </th>
                    <th width="22%">
                        <div class="row" >
                            <div class="col-md-9"><?php echo $this->lang->line('product_name');?></div>
                            <div class="col-md-3"><span class="glyphicon glyphicon-chevron-down sortbyname"></span></div>
                        </div>
                    </th>
                    <th>
                         <div class="row">
                            <div class="col-md-8"><?php echo $this->lang->line('price');?></div>
                            <div class="col-md-4"><span class="glyphicon glyphicon-chevron-down sortbyprice"></span></div>
                        </div>
                    </th>
                    <th  width="15%"><?php echo $this->lang->line('saleoff');?></th>
                    <th  width="12%"></th>
                </tr>
            </thead>
        <!--List products content-->
            <tbody>
                <tr data-toggle="collapse" data-target="#demo1" class="accordion-toggle">
                    <td>1</td>
                    <td class=' product-img'><img src=<?php echo  base_url('assets/userfile/img/products/MK001.jpg')?> class="img-rounded" width="40px" height="40px"></td>
                    <td class='text-info'  >MK001</td>
                    <td class="text-success">Móc Khóa Chữ A</td>
                    <td class="text-error">$300.00</td>
                    <td class="text-warning">20%</td>
                    <td><button class="btn btn-primary btn-delete" type="button">
                            <span class="glyphicon glyphicon-trash"></span>
                            <?php echo $this->lang->line('delete');?>
                        </button>
                    </td>
                </tr>
                <tr >
                    <td colspan="7" >
                        <div class="collapse out" id="demo1">
                       <?php 
                                    $this->load->view('manage_products/edit_manage_listproducts')
                            ?>   
                        </div>
                    </td>
                </tr>
                  <?php 
                  
                  for($i =1; $i<10;$i++){                                    
                      $dataForRow['id']=$i;
                      $dataForRow['price']=  rand ( 100 , 200 );
                      $dataForRow['saleoff']=  rand ( 10 , 70 );
                     $this->load->view('manage_products/a_product_row',$dataForRow);
                 }
                      
                   ?> 
                <!--Pagination-->
                <tr>
                    <td colspan="7">
                         <ul class="pagination">
                            <li><a href="#">&laquo;</a></li>
                            <li><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li><a href="#">&raquo;</a></li>
                          </ul>
                    </td>
                </tr>
            </tbody>
        </table>
    </div> 
</div>